$(function () {


    let laypage;
    let form;
    let layer;
    layui.use('laypage', function () {
        laypage = layui.laypage;
        form = layui.form;
        layer = layui.layer;

        //**************************************加载列表轮播图

        // 加载列表
        function list() {
            $.ajax({
                url: `/admin/swipers`,
                success: function (res) {
                    $('tbody').html('')
                    let a;
                    res.data.forEach(item => {
                        if (item.swiperstatus == 1) {
                            a = `<span class="layui-badge layui-bg-green" status=2  index=${item.id}>✔</span>`
                        } else if (item.swiperstatus == 2) {
                            a = `<span class="layui-badge layui-bg-cyan"  status=1 index=${item.id}>✖</span>`
                        }

                        $('tbody').append(`
                        <tr>
                           <td>${item.id}</td>
                           <td>
                               <img src="http://localhost:8888/uploads/${item.swiperimg}">
                           </td>
                           <td>${item.swiperlink}</td>
                           <td>
                               <!-- 在使用 -->
                               ${a}
                           </td>
                           <td>
                               <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete" index=${item.id}>
                                   删除
                               </button>
                           </td>
                        </tr>`)

                    });

                }
            })

        }
        list()



        // *************************************轮播图状态切换  使用还是未使用

        $('tbody').on('click', 'span', function () {
            let id = $(this).attr('index')

            let status = $(this).attr('status')
            $.ajax({
                url: `/admin/swipers/${id}`,
                type: `PUT`,
                data: {
                    status: status
                },
                success: function (res) {
                    layer.msg(res.message)
                    list()
                }
            })


        })



        // ***************************************删除操作


        $('tbody').on('click', '.delete', function () {
            let id = $(this).attr('index')
            layer.confirm('确定要删除吗', function (index) {
                $.ajax({
                    url: `/admin/swipers/${id}`,
                    type: `DELETE`,

                    success: function (res) {
                        layer.msg(res.message)
                        list()
                    }
                })


                layer.close(index);
            });


        })






        // ***************************************上传文件
        $('body').on('click', '#uploadSwiper', function () {
            $('#myfile').click()
        })

        // 监听文件选中事件
        $('body').on('change', '#myfile', function (e) {
            let files = e.target.files
            var fd = new FormData()
            $.each(files, function (index, item) {
                fd.append('swipers', item)

                console.log(item);
            })

            $.ajax({
                url: `/admin/swipers`,
                type: `POST`,
                data: fd,
                processData: false, //不转换
                contentType: false, //不编码
                success: function (res) {

                    layer.msg(res.message)
                    list()
                }
            })





        })










    })
















})